// 定制化重写一版,后期优化
import { isNumber } from 'lodash';
const useAutoSize = function(dom, minWidth = 200, maxWidth = 200) {
  const autoDom = document.getElementById(dom);
  const newElement = document.createElement('div');
  newElement.classList.add('ia-splitter-handle');
  const childElement = document.createElement('div');
  childElement.classList.add('ia-splitter-handle-highlight');
  newElement.appendChild(childElement);
  autoDom.appendChild(newElement);
  if (!autoDom) {
    return; // 如果autoDom不存在，则结束函数运行
  }
  let pressDown;
  const setElementStyle = () => {
    const style = {
      minWidth: isNumber(minWidth) ? minWidth + 'px' : minWidth,
      maxWidth: isNumber(maxWidth) ? maxWidth + 'px' : maxWidth,
      flex: 'none'
    };

    Object.assign(autoDom.style, style);
  };

  const resize = e => {
    const width = e.clientX - 136;
    autoDom.style.width = width + 'px';
  };

  const onMouseMove = event => {
    if (pressDown) {
      resize(event);
    }
  };

  const onMouseDown = () => {
    pressDown = true;
  };

  const onMouseUp = () => {
    pressDown = false;
  };

  setElementStyle();

  document.addEventListener('mousemove', onMouseMove);
  newElement.addEventListener('mousedown', onMouseDown);
  document.addEventListener('mouseup', onMouseUp);
};

export default useAutoSize;
